import React from 'react';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import {
    Card, Button, Row, Col,
    Form, Checkbox, Switch, Tabs,
    Select, DatePicker, Input, Radio,
    InputNumber, Table, Typography,
    Tooltip
} from 'antd';
import {
    PlusOutlined,
    ImportOutlined,
    PrinterOutlined,
    QuestionCircleOutlined
} from '@ant-design/icons';
import BomTree from './bomTree';

const { TabPane } = Tabs;
const { Text } = Typography;
const layout = {
    labelCol: { span: 5 },
    wrapperCol: { span: 19 },
};
class ViewPage extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            loading: false,
            visible: false,
            dataSource: []
        }
    }
    formRef = React.createRef();
    onFinish = (values) => {
        console.log(values)
    }
    render() {
        return (
            <PageHeaderWrapper>
                <Form {...layout} ref={this.formRef} onFinish={this.onFinish} >
                    <Row gutter={[16, 16]}>
                        <Col span={6}>
                            <Card>
                                <BomTree />
                            </Card>
                        </Col>
                        <Col span={18}>
                            <p>
                                <Button type="primary" icon={<PlusOutlined />}>新建</Button>
                                <Button type="primary" htmlType="submit" style={{ marginLeft: 5 }}>保存</Button>
                                <Button type="link" icon={<PrinterOutlined />}>打印预览</Button>
                            </p>
                            <Card>
                                <Tabs defaultActiveKey="1" >
                                    <TabPane tab="版本" key="1">
                                        <Row>
                                            <Col span={12}>
                                                <Form.Item label="物料编码" style={{ marginBottom: 0 }}>
                                                    <Input.Group compact>
                                                        <Form.Item
                                                            name={['ECORev', 'PartNum']}
                                                            rules={[{ required: true, message: "物料编码必填" }]}>
                                                            <Input />
                                                        </Form.Item>
                                                        <Form.Item>
                                                            <Button type="primary">选择</Button>
                                                        </Form.Item>
                                                    </Input.Group>
                                                </Form.Item>
                                                <Form.Item label="版本" name={['ECORev', 'RevisionNum']}
                                                    rules={[{ required: true, message: "版本必填" }]}>
                                                    <Input style={{ width: 200 }} />
                                                </Form.Item>
                                                <Form.Item label="版本描述" name={['ECORev', 'RevShortDesc']}>
                                                    <Input style={{ width: 200 }} />
                                                </Form.Item>
                                                <Form.Item label="生效日期" name={['ECORev', 'EffectiveDate']}
                                                    rules={[{ required: true, message: "生效日期必填" }]}>
                                                    <DatePicker />
                                                </Form.Item>

                                            </Col>
                                            <Col span={12}>
                                                <Form.Item style={{ marginBottom: 0 }} wrapperCol={{ offset: 5 }}>
                                                    <Input.Group compact>
                                                        <Form.Item
                                                            name={['ECORev', 'Inactive']}
                                                            valuePropName="checked">
                                                            <Checkbox>无效</Checkbox>
                                                        </Form.Item>
                                                        <Form.Item
                                                            name={['ECORev', 'Approved']}
                                                            valuePropName="checked">
                                                            <Checkbox>核准</Checkbox>
                                                        </Form.Item>
                                                    </Input.Group>
                                                </Form.Item>
                                                <Form.Item label="图纸地址" name={['ECORev', 'DrawURL']}>
                                                    <Input />
                                                </Form.Item>
                                            </Col>
                                        </Row>
                                    </TabPane>
                                    <TabPane tab="制造工艺" key="2">
                                        <Tabs defaultActiveKey="S1" >
                                            <TabPane tab="工序" key="S1">
                                                <Row>
                                                    <Col span={12}>
                                                        <Form.Item name={['ECOOpr', 'OprSeq']} label="序号">
                                                            <Input style={{ width: 100 }} />
                                                        </Form.Item>
                                                        <Form.Item style={{ marginBottom: 0 }} label="工序">
                                                            <Input.Group compact>
                                                                <Form.Item name={['ECOOpr', 'OpCode']}>
                                                                    <Select placeholder="选择工序" style={{ width: 150 }}></Select>
                                                                </Form.Item>
                                                                <Form.Item name={['ECOOpr', 'OpDesc']}>
                                                                    <Input disabled placeholder="工序描述" />
                                                                </Form.Item>
                                                            </Input.Group>
                                                        </Form.Item>
                                                        <Form.Item style={{ marginBottom: 0 }} wrapperCol={{ offset: 5 }}>
                                                            <Input.Group compact>
                                                                <Form.Item
                                                                    name={['ECOOpr', 'Subcontract']}
                                                                    valuePropName="checked">
                                                                    <Checkbox>外包</Checkbox>
                                                                </Form.Item>
                                                                <Form.Item
                                                                    name={['ECOOpr', 'FinalOpr']}
                                                                    valuePropName="checked">
                                                                    <Checkbox>最后工序</Checkbox>
                                                                </Form.Item>
                                                                <Form.Item
                                                                    name={['ECOOpr', 'AutoReceive']}
                                                                    valuePropName="checked">
                                                                    <Checkbox>自动收货</Checkbox>
                                                                </Form.Item>
                                                            </Input.Group>
                                                        </Form.Item>
                                                        <Form.Item name={['ECOOpr', 'Machines']}
                                                            label={
                                                                <span>
                                                                    排程块数&nbsp;
                                                                <Tooltip title="生产排程中可排的机器数量。例如，中心有4台机器，每天8小时，运行2台机器。此操作每天将消耗16小时的容量。因此，如果它有32个小时的预计产量，它将计划为2天。注：这只适用于生产小时数，总设置小时数将添加到压缩的生产小时数中，以获得计划的小时数。但是，它用于计算操作的总设置小时数。">
                                                                        <QuestionCircleOutlined />
                                                                    </Tooltip>
                                                                </span>
                                                            }>
                                                            <InputNumber style={{ width: 100 }} min={0} />
                                                        </Form.Item>
                                                        <Form.Item
                                                            name={['ECOOpr', 'SchedRelation']}
                                                            label="排程方式"
                                                            rules={[{ required: true, message: "请选择排程方式" }]}>
                                                            <Radio.Group name="radiogroup">
                                                                <Radio value="SS">开始-到-开始</Radio>
                                                                <Radio value="FS">结束-到-开始</Radio>
                                                                <Radio value="FF">结束-到-结束</Radio>
                                                            </Radio.Group>
                                                        </Form.Item>
                                                        <Form.Item name={['ECOOpr', 'SetHoursPerMach']} label="小时">
                                                            <InputNumber style={{ width: 100 }} min={0} />
                                                        </Form.Item>
                                                        <Form.Item name={['ECOOpr', 'AddlSetUpQty']} label="附加准备数量">
                                                            <InputNumber style={{ width: 100 }} min={0} />
                                                        </Form.Item>
                                                        <Form.Item name={['ECOOpr', 'AddlSetupHours']} label="附加准备时间">
                                                            <InputNumber style={{ width: 100 }} min={0} />
                                                        </Form.Item>
                                                    </Col>
                                                    <Col span={12}>
                                                        <Form.Item name={['ECOOpr', 'QtyPer']} label="数量/父项">
                                                            <InputNumber style={{ width: 100 }} min={0} />
                                                        </Form.Item>
                                                        <Form.Item label="生产标准">
                                                            <Input.Group compact>
                                                                <Form.Item
                                                                    noStyle
                                                                    name={['ECOOpr', 'ProdStandard']}
                                                                    rules={[{ required: true, message: "请输入生产标准" }]}>
                                                                    <InputNumber style={{ width: 200 }} min={0} />
                                                                </Form.Item>
                                                                <Form.Item noStyle name={['ECOOpr', 'StdFormat']}>
                                                                    <Select placeholder="小时/件" style={{ width: 90 }}>
                                                                        <Select.Option key="HP">小时/件</Select.Option>
                                                                        <Select.Option key="MP">分钟/件</Select.Option>
                                                                        <Select.Option key="PM">件/分钟</Select.Option>
                                                                        <Select.Option key="OH">件/小时</Select.Option>
                                                                    </Select>
                                                                </Form.Item>
                                                            </Input.Group>
                                                        </Form.Item>

                                                        <Form.Item label="资源群组" name={['ECOOpr', 'ResourceGrpID']}
                                                            rules={[{ required: true, message: "请选择资源群组" }]}>
                                                            <Select placeholder="资源群组" style={{ width: 200 }}></Select>
                                                        </Form.Item>
                                                        <Form.Item label="资源" name={['ECOOpr', 'ResourceID']}
                                                            rules={[{ required: true, message: "请选择资源" }]}>
                                                            <Select placeholder="资源" style={{ width: 200 }}></Select>
                                                        </Form.Item>
                                                        <Form.Item label="工序备注" name={['ECOOpr', 'CommentText']}>
                                                            <Input.TextArea rows={3} />
                                                        </Form.Item>
                                                    </Col>
                                                </Row>
                                            </TabPane>
                                            <TabPane tab="物料" key="S2">
                                                <Row>
                                                    <Col span={12}>
                                                        <Form.Item name={['ECOMtl', 'MtlSeq']} label="物料序号">
                                                            <Select style={{ width: 100 }}>
                                                            </Select>
                                                        </Form.Item>
                                                        <Form.Item label="物料编码" style={{ marginBottom: 0 }}>
                                                            <Input.Group compact>
                                                                <Form.Item
                                                                    name={['ECOMtl', 'PartNum']}
                                                                    rules={[{ required: true, message: "物料编码必填" }]}>
                                                                    <Input />
                                                                </Form.Item>
                                                                <Form.Item>
                                                                    <Button type="primary">选择</Button>
                                                                </Form.Item>
                                                            </Input.Group>
                                                        </Form.Item>
                                                        <Form.Item name={['ECOMtl', 'MtlPartDescription']} label="描述">
                                                            <Input disabled />
                                                        </Form.Item>
                                                        <Form.Item style={{ marginBottom: 0 }} label="相关工序">
                                                            <Input.Group compact>
                                                                <Form.Item name={['ECOMtl', 'RelatedOperation']}>
                                                                    <Input placeholder="10" />
                                                                </Form.Item>
                                                                <Form.Item>
                                                                    <Input placeholder="工序描述" />
                                                                </Form.Item>
                                                            </Input.Group>
                                                        </Form.Item>
                                                        <Form.Item label="数量/父项">
                                                            <Input.Group compact>
                                                                <Form.Item
                                                                    noStyle
                                                                    name={['ECOMtl', 'QtyPer']}
                                                                    rules={[{ required: true, message: "需求数量必填" }]}>
                                                                    <InputNumber min={1} style={{ width: 120 }} />
                                                                </Form.Item>
                                                                <Form.Item
                                                                    noStyle
                                                                    name={['ECOMtl', 'IUM']}
                                                                    rules={[{ required: true, message: "单位必填" }]}>
                                                                    <Input style={{ width: 70,marginRight:10 }} placeholder="单位" />
                                                                </Form.Item>
                                                                <Form.Item
                                                                    noStyle
                                                                    name={['ECOMtl', 'FixedQty']}
                                                                    valuePropName="checked">
                                                                    <Checkbox>固定数量</Checkbox>
                                                                </Form.Item>
                                                            </Input.Group>
                                                        </Form.Item>
                                                        <Form.Item style={{ marginBottom: 0 }} wrapperCol={{ offset: 5 }}>
                                                            <Input.Group compact>
                                                                <Form.Item
                                                                    name={['ECOMtl', 'PullAsAsm']}
                                                                    valuePropName="checked">
                                                                    <Checkbox>当半成品提取</Checkbox>
                                                                </Form.Item>
                                                                <Form.Item
                                                                    name={['ECOMtl', 'PlanAsAsm']}
                                                                    valuePropName="checked">
                                                                    <Checkbox>当半成品计划</Checkbox>
                                                                </Form.Item>
                                                                <Form.Item
                                                                    name={['ECOMtl', 'ViewAsAsm']}
                                                                    valuePropName="checked">
                                                                    <Checkbox>视为半成品</Checkbox>
                                                                </Form.Item>
                                                            </Input.Group>
                                                        </Form.Item>
                                                    </Col>
                                                    <Col span={12}></Col>
                                                </Row>
                                            </TabPane>
                                        </Tabs>
                                    </TabPane>
                                </Tabs>
                            </Card>
                        </Col>
                    </Row>
                </Form>
            </PageHeaderWrapper>
        )
    }
}
export default ViewPage;